<template>
  <div class="d_main">
    <!-- 操作区 S-->
    <div class="d_operationBox">
      <div class="d_btn">
        <el-button
          type="primary"
          size="small"
          icon="el-icon-plus"
          v-permission="'MenuCode5-7-2-1'"
          @click="newAddClick"
          >新建</el-button
        >
      </div>
      <div class="d_search">
        <screec
          v-model="search.QueryDataBaseFiled"
          :headData.sync="tableHead"
          :disabled="searchLoading"
        ></screec>
        <el-input
          v-model="search.likeWords"
          placeholder="请输入关键字"
          size="small"
          @keyup.enter.native="getAllMaterils"
        >
          <el-button
            slot="append"
            :loading="searchLoading"
            type="primary"
            icon="el-icon-search"
            :disabled="searchLoading"
            element-loading-spinner="el-icon-loading"
            @click="getAllMaterils"
          >
            搜索
          </el-button>
        </el-input>
      </div>
    </div>
    <!-- 操作区 E-->
    <!-- 表格操作区 S-->
    <div class="d_tableOperation">
      <div class="d_condition"></div>
      <div class="d_set">
        <div @click="Refresh"><i class="d_icon el-icon-refresh-right" /></div>
        <div class="setting flex">
          <HeadSeting
            :list-data.sync="tableHead"
            :table-code="$config.cpscrapbilllist"
            @reset="getTableHead"
          />
        </div>
      </div>
    </div>
    <!-- 表格操作区 E-->
    <div ref="tableCon" class="tableCon">
      <el-table
        v-show="tableHead.length > 0"
        id="emtable"
        ref="multipleTable"
        v-loading="searchLoading"
        :data="allMaterirls"
        :height="tableHeight || 'auto'"
        border
        fit
        style="width: 100%"
        @header-dragend="surverWidth"
      >
        <template v-for="(fruit, index) in tableHead">
          <el-table-column
            v-if="fruit.visible"
            :key="index"
            :label="fruit.columnName"
            :min-width="fruit.columnWidth || 90"
            :prop="fruit.columnCode"
            show-overflow-tooltip
            :fixed="fruit.isFloat ? 'left' : false"
          >
            <template slot-scope="scope">
              <div
                v-if="fruit.columnCode === 'scrapBillStateName'"
                class="flex"
              >
                <template v-if="scope.row.scrapBillState === 0">
                  <span class="mr5 spot" style="background: #3f61f1" />{{
                    scope.row[fruit.columnCode]
                  }}
                </template>
                <template v-else-if="scope.row.scrapBillState === 1">
                  <span class="mr5 spot" style="background: #67c23a" />{{
                    scope.row[fruit.columnCode]
                  }}
                </template>
                <template v-else>
                  <span class="mr5 spot" style="background: #999aaa" />{{
                    scope.row[fruit.columnCode]
                  }}
                </template>
              </div>
              <div
                v-else-if="fruit.columnCode === 'outStockStateName'"
                class="flex"
              >
                <template v-if="scope.row.outStockState === 0">
                  <span class="mr5 spot" style="background: #3f61f1" />{{
                    scope.row[fruit.columnCode]
                  }}
                </template>
                <template v-else-if="scope.row.outStockState === 1">
                  <span class="mr5 spot" style="background: #67c23a" />{{
                    scope.row[fruit.columnCode]
                  }}
                </template>
                <template v-else>
                  <span class="mr5 spot" style="background: #e13335" />{{
                    scope.row[fruit.columnCode]
                  }}
                </template>
              </div>
              <template v-else>
                {{ scope.row[fruit.columnCode] }}
              </template>
            </template></el-table-column
          >
        </template>
        <el-table-column label="操作" width="70px" fixed="right" align="center">
          <template slot-scope="scope">
            <div>
              <el-popover
                :ref="`popover-${scope.$index}`"
                placement="bottom-end"
                popper-class="tableOp"
                width="160"
                :popper-options="{
                  boundariesElement: 'opBox',
                  removeOnDestroy: true,
                }"
                trigger="click"
              >
                <div class="operation">
                  <ul>
                    <li @click="handleClick(scope.row)">查看</li>
                    <li
                      v-show="scope.row.scrapBillState === 0"
                      v-permission="'MenuCode5-7-2-2'"
                      @click="handleUpdata(scope.row)"
                    >
                      修改
                    </li>
                  </ul>
                  <ul>
                    <li
                      v-show="scope.row.scrapBillState === 0"
                      v-permission="'MenuCode5-7-2-3'"
                      @click="handleConfirm(scope.row)"
                    >
                      确认
                    </li>
                    <li
                      v-show="
                        scope.row.scrapBillState === 1 &&
                        scope.row.stockState === 0
                      "
                      v-permission="'MenuCode5-7-2-5'"
                      @click="handleDone(scope.row)"
                    >
                      作废
                    </li>
                    <li
                      v-show="scope.row.scrapBillState === -1"
                      v-permission="'MenuCode5-7-2-6'"
                      @click="handleCopy(scope.row)"
                    >
                      复制
                    </li>
                  </ul>
                  <ul>
                    <li
                      v-show="scope.row.scrapBillState === 0"
                      v-permission="'MenuCode5-7-2-4'"
                      @click="handleDelete(scope.row)"
                    >
                      删除
                    </li>
                  </ul>
                </div>
                <div slot="reference" class="opBox pointer">
                  <span class="el-icon-more c_3F61F1" />
                </div>
              </el-popover>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <!-- 骨架屏     -->
      <div v-if="tableHead.length == 0" class="p16">
        <el-skeleton :rows="6" animated />
      </div>
    </div>
    <!-- 分页 S-->
    <div class="d_pag">
      <pagination
        :total="total || 0"
        :page.sync="search.pageIndex"
        :limit.sync="search.pageSize"
        @pagination="getAllMaterils"
      />
    </div>
    <!-- 分页 E-->
    <!-- 人员寻找弹框   -->
    <per-redio-dialog
      :per-visible.sync="isperShow"
      @getEmployee="getEmployee"
    />
    <el-dialog
      :title="tname"
      :visible.sync="isAddProduct"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
      @close="closeDialog"
      @open="openCp"
      destroy-on-close
    >
      <div class="dialogDody">
        <div class="subTip">
          <span class="mr15"
            ><span class="mr5">报废单号：</span
            >{{ ProductForm.scrapBillNo || "系统自动生成" }}</span
          >
          <span class="mr15"
            ><span class="mr5">创建日期：</span
            >{{ ProductForm.createTime || dayjs().format("YYYY-MM-DD") }}</span
          >
          <span
            ><span class="mr5">创建人员：</span
            >{{ opsid != 1 ? ProductForm.createPersonName : name }}</span
          >
        </div>
        <div class="addWuliaoBox h100">
          <el-form
            ref="ProductForm"
            :model="ProductForm"
            :rules="rules"
            label-width="110px"
            label-position="left"
            class="dialogForm dialogInlineForm h100"
            :disabled="canDiable"
          >
            <el-row class="h100">
              <el-col class="mt15 h100 boxleft">
                <el-row>
                  <el-col :span="8">
                    <el-form-item label="报废类型" prop="scrapTypeName">
                      <el-input
                        v-model="ProductForm.scrapTypeName"
                        placeholder="报废类型"
                        size="mini"
                        disabled
                      />
                      <!-- <el-select
                        filterable v-model="ProductForm.getMaterialType" placeholder="领料类型" size="mini">
                    <el-option
                      v-for="item in purchaseTypes"
                      :key="item.dicValueID"
                      :label="item.dicValueDesc"
                      :value="item.dicValueCode"
                    />
                  </el-select> -->
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="报废人员" prop="scrapPersonName">
                      <div class="flex flex_center">
                        <div class="flex1">
                          <el-input
                            v-model="ProductForm.scrapPersonName"
                            size="mini"
                            placeholder="请选择人员"
                            :disabled="canDiable"
                          >
                            <el-button
                              slot="append"
                              icon="el-icon-user"
                              :disabled="canDiable"
                              @click="isperShow = true"
                            />
                          </el-input>
                        </div></div
                    ></el-form-item>
                  </el-col>
                </el-row>
                <el-form-item label="报废备注" class="scrapRemark">
                  <el-input
                    v-model="ProductForm.scrapRemark"
                    type="textarea"
                    :rows="1"
                    placeholder="报废备注"
                    size="mini"
                    clearable
                  />
                </el-form-item>
                <div class="tableBox">
                  <div class="tt flex flex_between">
                    <span class="fw">报废明细</span>
                    <span
                      v-if="!canDiable"
                      class="c_3F61F1 mr15 pointer"
                      @click="addMX"
                      ><i class="el-icon-plus mr5" /> 选择成品</span
                    >
                  </div>
                  <div ref="bigdialogTable" class="bigdialogTbCon">
                    <el-table
                      ref="multipleTable"
                      :data="ProductForm.mxDataList"
                      border
                      fit
                      style="width: 100%"
                      :expand-row-keys="expends"
                      :row-key="getRowKeys"
                    >
                      <el-table-column type="expand">
                        <template slot-scope="{ row }">
                          <div class="dialogExpandTable">
                            <el-table
                              :data="row.packageDataList || []"
                              :header-cell-style="{ background: '#3f61f110' }"
                            >
                              <el-table-column
                                prop="packageGuiGeName"
                                label="纸箱规格"
                                min-width="90"
                              />
                              <el-table-column
                                prop="packageDescription"
                                label="包装描述"
                                min-width="90"
                              />
                              <el-table-column
                                prop="eachBoxQuantity"
                                label="每箱数量"
                                min-width="90"
                              />
                              <el-table-column
                                v-if="opsid == 1 || opsid == 4 || opsid == 5"
                                prop="stockBoxCount"
                                label="库存箱数"
                                min-width="90"
                              />
                              <el-table-column
                                v-if="opsid == 1 || opsid == 4 || opsid == 5"
                                prop="stockQuantity"
                                label="库存数量"
                                min-width="90"
                              >
                                <!-- <template slot-scope="scope">
                                  <div class="flex">
                                    <template>
                                      <span class="mr5" style="color: #E13335">{{ scope.row.stockQuantity }}</span>
                                    </template>
                                  </div>
                                </template> -->
                              </el-table-column>
                              <el-table-column
                                label="报废箱数"
                                prop="scrapBoxAmount"
                                show-overflow-tooltip
                                min-width="90"
                              >
                                <template slot-scope="{ row }">
                                  <el-input
                                    v-model.number="row.scrapBoxAmount"
                                    :disabled="canDiable"
                                    placeholder="请输入"
                                    size="mini"
                                    @blur="statistics"
                                    type="number"
                                  />
                                </template>
                              </el-table-column>
                              <el-table-column
                                label="报废数量"
                                prop="scrapQuantity"
                                show-overflow-tooltip
                                min-width="90"
                              >
                                <template slot-scope="{ row }">
                                  <el-input
                                    v-model.number="row.scrapQuantity"
                                    :disabled="canDiable"
                                    placeholder="请输入"
                                    size="mini"
                                    @blur="statistics"
                                    type="number"
                                  />
                                </template>
                              </el-table-column>
                              <el-table-column
                                label="备注"
                                prop="scrapMxRemark"
                                show-overflow-tooltip
                                min-width="90"
                              >
                                <template slot-scope="{ row }">
                                  <el-input
                                    v-model="row.scrapMxRemark"
                                    :disabled="canDiable"
                                    placeholder="请输入"
                                    size="mini"
                                  />
                                </template>
                              </el-table-column>
                              <el-table-column
                                v-if="!canDiable"
                                label="操作"
                                width="auto"
                                align="center"
                              >
                                <template slot-scope="scope">
                                  <el-tooltip
                                    class="item"
                                    effect="dark"
                                    content="删除"
                                    placement="right-start"
                                  >
                                    <span
                                      class="pointer"
                                      @click="
                                        zxDelete(
                                          row.packageDataList,
                                          scope.$index
                                        )
                                      "
                                      ><i class="el-icon-delete"
                                    /></span>
                                  </el-tooltip>
                                </template>
                              </el-table-column>
                            </el-table>
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column
                        prop="productNo"
                        label="成品编号"
                        width="120"
                      />
                      <el-table-column
                        prop="productTypeName"
                        label="成品类型"
                        width="120"
                      />
                      <el-table-column
                        prop="productName"
                        label="产品名称"
                        width="auto"
                      />
                      <el-table-column
                        prop="printingSurface"
                        label="版面"
                        width="120"
                      />
                      <el-table-column
                        prop="productVersion"
                        label="版本"
                        width="120"
                      />
                      <el-table-column
                        v-if="opsid == 1 || opsid == 4 || opsid == 5"
                        prop="sumBoxCount"
                        label="库存箱数"
                        width="120"
                      />
                      <el-table-column
                        v-if="opsid == 1 || opsid == 4 || opsid == 5"
                        prop="sumStockQuantity"
                        label="库存数量"
                        width="120"
                      >
                        <!-- <template slot-scope="scope">
                          <div class="flex">
                            <template>
                              <span class="mr5" style="color: #E13335">{{ scope.row.sumStockQuantity }}</span>
                            </template>
                          </div>
                        </template> -->
                      </el-table-column>
                      <el-table-column
                        prop="scrapTotalBox"
                        label="报废总箱数"
                        width="120"
                      />
                      <el-table-column
                        prop="scrapTotalSum"
                        label="报废总数量"
                        width="120"
                      />
                      <el-table-column
                        prop="productUnit"
                        label="单位"
                        width="60"
                      />

                      <el-table-column
                        v-if="!canDiable"
                        label="操作"
                        width="auto"
                        align="center"
                      >
                        <template slot-scope="scope">
                          <el-tooltip
                            class="item"
                            effect="dark"
                            content="删除"
                            placement="right-start"
                          >
                            <span
                              class="pointer"
                              @click="purchaseDelete(scope.$index)"
                              ><i class="el-icon-delete"
                            /></span>
                          </el-tooltip>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                </div>
              </el-col>
            </el-row>
          </el-form>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isAddProduct = false">取 消</el-button>
        <!-- 新增       -->
        <el-button
          v-if="opsid !== 2"
          :loading="addProductLoading"
          :disabled="addProductLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click="savell"
          >{{ btm }}</el-button
        >
      </div>
    </el-dialog>
    <!-- 选择成品 -->
    <el-dialog
      append-to-body
      title="选择成品"
      :visible.sync="isSemidialog"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="70%"
      @close="closeSemiDialog"
      @open="openmater"
    >
      <div class="dialogDody marDialog flex flex_column">
        <div class="btnCon flex flex_end">
          <!--      搜索框-->
          <div class="search">
            <el-input
              v-model="SemiSearch.likeWords"
              placeholder="输入关键字"
              size="small"
            >
              <el-button
                slot="append"
                :loading="marLoading"
                type="primary"
                icon="el-icon-search"
                :disabled="marLoading"
                element-loading-spinner="el-icon-loading"
                @click="openmater"
              >
                搜索
              </el-button>
            </el-input>
          </div>
        </div>
        <!-- 表格区域       -->
        <div class="tableCon not">
          <el-table
            ref="multipleTable"
            :data="dataList"
            border
            fit
            style="width: 100%"
          >
            <el-table-column type="expand">
              <template slot-scope="{ row }">
                <div class="dialogExpandTable">
                  <el-table
                    :data="row.productPackageList || []"
                    :header-cell-style="{ background: '#3f61f110' }"
                    @selection-change="handlecpChange($event, row)"
                  >
                    <el-table-column prop="selection" width="55">
                      <el-table-column type="selection" width="55" />
                      <el-table-column
                        prop="cartonSizeName"
                        label="纸箱规格"
                        min-width="90"
                      />
                      <el-table-column
                        prop="packageDescription"
                        label="包装描述"
                        min-width="90"
                      />
                      <el-table-column
                        prop="eachBoxQuantity"
                        label="包装数量"
                        min-width="90"
                      />

                      <el-table-column
                        prop="stockBoxCount"
                        label="库存箱数"
                        min-width="90"
                      />
                      <el-table-column
                        prop="stockQuantity"
                        label="库存数量"
                        min-width="90"
                      />
                    </el-table-column>
                  </el-table>
                </div>
              </template>
            </el-table-column>
            >
            <el-table-column prop="productNo" label="成品编号" width="120" /> >
            <el-table-column
              prop="productTypeName"
              label="成品类型"
              width="120"
            />
            >
            <el-table-column prop="customerName" label="	所属客户" width="180" />
            >
            <el-table-column prop="productName" label="产品名称" width="220" />
            >
            <el-table-column prop="printingSurface" label="版面" width="120" />
            >
            <el-table-column prop="productVersion" label="版本" width="120" /> >
            <el-table-column
              prop="sumBoxCount"
              label="库存总箱数"
              width="120"
            />
            <el-table-column
              prop="sumStockQuantity"
              label="库存总数量"
              width="120"
            />
            > <el-table-column prop="productUnit" label="单位" width="auto" />
          </el-table>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isSemidialog = false">取 消</el-button>
        <el-button
          v-loading="addLoading"
          :disabled="addLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click="saveCp"
        >
          确定</el-button
        >
      </div>
    </el-dialog>
    <!-- 原因   -->
    <el-dialog
      title="作废原因"
      :visible.sync="isNopassshow"
      :close-on-click-modal="false"
      custom-class="comDialog"
      width="40%"
      @close="closePassDialog"
    >
      <div class="dialogDody">
        <el-form ref="passForm" :model="passForm" class="dialogForm">
          <el-form-item class="mt12">
            <el-input
              v-model="passForm.cancelReason"
              prop="cancelReason"
              type="textarea"
              placeholder="请输入内容"
              :autosize="{ minRows: 6 }"
              size="mini"
            />
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isNopassshow = false">取 消</el-button>
        <el-button
          :disabled="addLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click="passSave"
          >提交</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { arraySort } from "@/utils";
import HeadSeting from "@/components/HeadSeting";
import Pagination from "@/components/Pagination";
import perRedioDialog from "@/components/perDialogRedio";
import SelectLLorder from "@/components/selectLLorder";
import { mapGetters } from "vuex";
import screec from "@/components/screen";
export default {
  name: "Materiel",
  components: { Pagination, HeadSeting, perRedioDialog, SelectLLorder, screec },
  data() {
    return {
      ops: "add", // 操作、新建，修改，查看
      opsid: 1, // 3 确定 1 新建， 4 修改， 2 查看
      tableHeight: null, // 表格最大高度
      showOrder: false,
      isSeeMaterriel: false, // 查看弹框是否打开
      isAddMaterriel: false, // 新建弹框是否打开
      addMaterrielLoading: false, // 新建保存加载
      searchLoading: false, // 搜索加载效果
      allMaterirls: [], // 全部数据列表
      colorState: null,
      isCustomerInfo: false,
      addLableLoading: false,
      isAdressDialog: false,
      expends: [],
      cusLoading: false,
      radioCusSelect: null,
      currentCuslistRow: null,
      cusSearch: {
        likeWords: "",
      },
      addLoading: false,
      selectRow: null,
      shippingAddres: [],
      isNopassshow: false,
      ReceivingTypeList: [],
      SendingTypeList: [],
      LogisticsPaidTypeList: [],
      FYDepartmentList: [],
      equipmentList: [],
      option: {
        disabledDate: (time) => {
          return time.getTime() < Date.now() - 1 * 24 * 3600 * 1000;
        },
      },
      passForm: {
        cancelReason: "",
      },
      // 表格操作
      ProductForm: {
        scrapTypeName: "成品报废",
        scrapPersonName: "",
        scrapPerson: "",
        scrapType: 1,
        mxDataList: [],
      },
      // 搜索条件
      search: {
        QueryDataBaseFiled: "",
        pageIndex: 1,
        pageSize: 30,
        scrapType: 1,
        scrapBillState: -1,
        outStockState: -1,
        likeWords: "",
      },
      total: 0, // 总条数
      tableHead: [], // 表格表头
      radioContractSelect: null, // 客户合同单选值
      addProductLoading: false,
      isAddProduct: false,
      isperShow: false,
      isSemidialog: false,
      contractLists: [],
      multipleSelection: null,
      purchaseInfoDatas: [{}],
      cusDataLists: [],
      allSupliers: [],
      shippingAddress: [],
      allAddress: [],
      selectcpRow: null,
      dataList: [],
      purchaseTypes: [
        {
          dicValueID: 0,
          dicValueDesc: "生产领料",
          dicValueCode: 1,
        },
        {
          dicValueID: 1,
          dicValueDesc: "生产补料",
          dicValueCode: 2,
        },
      ],
      SemiSearch: {
        likeWords: "",
        productType: 1,
        productNo: "",
      },
      materialList: [],
      marLoading: false,
      canDiable: false,
      rules: {
        scrapPersonName: [
          { required: true, message: "请选择人员", trigger: "change" },
        ],
      },
    };
  },
  computed: {
    ...mapGetters(["name", "userInfo"]),
    btm() {
      if (this.opsid === 3) {
        return "确认";
      } else {
        return "保存";
      }
    },
    tname() {
      if (this.opsid === 1) {
        return "新建成品报废";
      } else if (this.opsid === 2) {
        return "查看成品报废";
      } else if (this.opsid === 3) {
        return "确定成品报废";
      } else if (this.opsid === 4) {
        return "修改成品报废";
      } else {
        return "复制成品报废";
      }
    },
  },
  created() {
    //  所有列表数据
    this.getAllMaterils();
    // 表格得表头
    this.getTableHead();
  },
  mounted() {
    // 表格高度
    this.calHeight();
  },
  updated() {
    this.$nextTick(() => {
      this.$refs.multipleTable.doLayout();
    });
  },
  methods: {
    getExpends() {
      var productNo = this.ProductForm.mxDataList.map((e) => e.productNo);
      this.expends = productNo;
    },
    addMX() {
      this.isSemidialog = true;
    },
    getRowKeys(row) {
      return row.productNo;
    },
    closePassDialog() {
      this.passForm.cancelReason = "";
      this.selectRow = null;
    },
    // 新建点击事件
    newAddClick() {
      this.ops = "add";
      this.opsid = 1;
      this.isAddProduct = true;
      this.canDiable = false;
    },
    handleClick(row) {
      this.opsid = 2;
      this.canDiable = true;
      this.getDetail(row);
    },
    handleConfirm(row) {
      this.opsid = 3;
      this.canDiable = true;
      this.getDetail(row);
    },
    handleDone(row) {
      this.selectRow = row;
      this.isNopassshow = true;
    },
    handleCopy(row) {
      this.opsid = 5;
      this.canDiable = false;
      this.openCp();
      const _data = {
        queryBy: 1,
        queryValue: row.id,
      };
      this.$api.warehouse.GetSingleProduceLogistics(_data).then((res) => {
        delete res.id;
        delete res.code;
        this.ProductForm = res;
        this.isAddProduct = true;
      });
    },
    handleUpdata(row) {
      this.opsid = 4;
      this.canDiable = false;
      this.getDetail(row);
    },
    passSave() {
      const _data = {
        entityID: this.selectRow.id,
      };
      this.$api.warehouse
        .VoidProduceLogistics(_data)
        .then(() => {
          this.getAllMaterils();
          this.isNopassshow = false;
          this.addLoading = false;
          this.$message({
            message: "作废成功",
            type: "success",
          });
        })
        .catch(() => {});
    },
    handleDelete(row) {
      const _data = {
        scrapBillID: row.scrapBillID,
      };
      this.$confirm("确定删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.$api.warehouse
          .DeleteFinishedProductScrapBill(_data)
          .then(() => {
            this.getAllMaterils();
            this.$message({
              message: "删除成功",
              type: "success",
            });
          })
          .catch(() => {});
      });
    },
    getDetail(row) {
      const _data = {
        scrapBillID: row.scrapBillID,
      };
      this.$api.warehouse
        .GetFinishedProductScrapBillDetail(_data)
        .then((res) => {
          res.mxDataList.forEach((e) => {
            e.packageDataList = e.productPackageList;
            e.productPackageList.forEach((e2) => {
              e2.packageGuiGeName = e2.cartonSizeName;
            });
          });
          res.baseData.mxDataList = res.mxDataList;
          this.ProductForm = res.baseData;
          this.getExpends();
          this.statistics();
          this.isAddProduct = true;
        });
    },
    purchaseDelete(index) {
      this.ProductForm.mxDataList.splice(index, 1);
    },
    zxDelete(row, index) {
      row.splice(index, 1);
    },
    // 选择成品
    openmater() {
      this.$api.warehouse
        .GetMatchFinishedProductDataList(this.SemiSearch)
        .then((res) => {
          this.dataList = res;
          this.searchLoading = false;
        })
        .catch(() => {
          this.searchLoading = false;
        });
    },
    openCp() {
      this.shippingAddress = [];
    },
    savell() {
      if (this.opsid === 3) {
        const _data3 = {
          scrapBillID: this.ProductForm.scrapBillID,
        };
        this.$api.warehouse
          .SureFinishedProductScrapBill(_data3)
          .then(() => {
            this.addProductLoading = false;
            this.isAddProduct = false;
            this.getAllMaterils();
            this.$message({
              message: "确认成功",
              type: "success",
            });
          })
          .catch(() => {
            this.addProductLoading = false;
          });
      } else if (this.opsid === 4) {
        let _flag = false;
        const parmas = this.ProductForm;
        if (
          !this.ProductForm.mxDataList ||
          this.ProductForm.mxDataList.length === 0
        ) {
          this.$message({
            message: "请选择报废明细",
            type: "error",
          });
        } else {
          for (
            let index = 0;
            index < this.ProductForm.mxDataList.length;
            index++
          ) {
            for (
              let index2 = 0;
              index2 <
              this.ProductForm.mxDataList[index].packageDataList.length;
              index2++
            ) {
              const _scrapBoxAmount =
                this.ProductForm.mxDataList[index].packageDataList[index2]
                  .scrapBoxAmount;
              const _scrapQuantity =
                this.ProductForm.mxDataList[index].packageDataList[index2]
                  .scrapQuantity;
              if (!_scrapBoxAmount || !_scrapQuantity) {
                this.$message({
                  message: "请输入报废数和报废箱数",
                  type: "warning",
                });
                break;
              } else {
                if (
                  this.ProductForm.mxDataList[index].packageDataList[index2]
                    .scrapQuantity >
                  this.ProductForm.mxDataList[index].packageDataList[index2]
                    .stockQuantity
                ) {
                  this.ProductForm.mxDataList[index].packageDataList[
                    index2
                  ].scrapQuantity =
                    this.ProductForm.mxDataList[index].packageDataList[
                      index2
                    ].stockQuantity;
                  this.$message({
                    message: "报废数量不能大于库存数量",
                    type: "warning",
                  });
                  break;
                } else {
                  _flag = true;
                }
              }
            }
          }
          if (_flag) {
            this.$refs.ProductForm.validate((valid) => {
              if (valid) {
                this.addProductLoading = true;
                this.$api.warehouse
                  .UpdateFinishedProductScrapBill(parmas)
                  .then(() => {
                    this.addProductLoading = false;
                    this.isAddProduct = false;
                    this.getAllMaterils();
                    this.$message({
                      message: "修改成功",
                      type: "success",
                    });
                  })
                  .catch(() => {
                    this.addProductLoading = false;
                  });
              }
            });
          }
        }
      } else {
        let _flag = false;
        const parmas = this.ProductForm;
        if (
          !this.ProductForm.mxDataList ||
          this.ProductForm.mxDataList.length === 0
        ) {
          this.$message({
            message: "请选择报废明细",
            type: "error",
          });
        }
        for (
          let index = 0;
          index < this.ProductForm.mxDataList.length;
          index++
        ) {
          for (
            let index2 = 0;
            index2 < this.ProductForm.mxDataList[index].packageDataList.length;
            index2++
          ) {
            const _scrapBoxAmount =
              this.ProductForm.mxDataList[index].packageDataList[index2]
                .scrapBoxAmount;
            const _scrapQuantity =
              this.ProductForm.mxDataList[index].packageDataList[index2]
                .scrapQuantity;
            if (!_scrapBoxAmount || !_scrapQuantity) {
              this.$message({
                message: "请输入报废数和报废箱数",
                type: "warning",
              });
              break;
            } else {
              if (
                this.ProductForm.mxDataList[index].packageDataList[index2]
                  .scrapQuantity >
                this.ProductForm.mxDataList[index].packageDataList[index2]
                  .stockQuantity
              ) {
                this.ProductForm.mxDataList[index].packageDataList[
                  index2
                ].scrapQuantity =
                  this.ProductForm.mxDataList[index].packageDataList[
                    index2
                  ].stockQuantity;
                this.$message({
                  message: "报废数量不能大于库存数量",
                  type: "warning",
                });
                break;
              } else {
                _flag = true;
              }
            }
          }
        }
        if (_flag) {
          this.$refs.ProductForm.validate((valid) => {
            if (valid) {
              this.addProductLoading = true;
              this.$api.warehouse
                .CreateNewFinishedProductScrapBill(parmas)
                .then(() => {
                  this.addProductLoading = false;
                  this.isAddProduct = false;
                  this.getAllMaterils();
                  this.$message({
                    message: "保存成功",
                    type: "success",
                  });
                })
                .catch(() => {
                  this.addProductLoading = false;
                });
            }
          });
        }
      }
    },

    // 得到申请人员
    getEmployee(val) {
      this.ProductForm.scrapPersonName = val.employeeName;
      this.ProductForm.scrapPerson = val.employeeCode;
    },
    supplierChange(val) {
      this.materSearch.supplierCode = val;
      this.purchaseInfoDatas = [];
    },
    closeSemiDialog() {
      this.isSemidialog = false;
    },
    MarterdialogShow() {},

    //统计
    statistics() {
      let arr = JSON.parse(JSON.stringify(this.ProductForm.mxDataList));
      arr.forEach((i) => {
        i.scrapTotalBox = 0;
        i.scrapTotalSum = 0;
        i.packageDataList.forEach((j) => {
          if (j.scrapBoxAmount) {
            i.scrapTotalBox += j.scrapBoxAmount;
          }
          if (j.scrapQuantity) {
            i.scrapTotalSum += j.scrapQuantity;
          }
        });
      });
      this.$forceUpdate();
      this.ProductForm.mxDataList = arr;
      console.log(this.ProductForm.mxDataList);
    },

    handlecpChange(event, row) {
      const _row = row;
      _row.packageDataList = event;
      event.forEach((e) => {
        e.packageGuiGeName = e.cartonSizeName;
      });
      this.selectcpRow = _row;
    },
    saveCp() {
      const array = JSON.parse(JSON.stringify(this.ProductForm.mxDataList));
      const arr = JSON.parse(JSON.stringify(this.selectcpRow));
      const val = array.some(({ productNo }) => productNo === arr.productNo);
      if (!val) {
        this.ProductForm.mxDataList.push(this.selectcpRow);
      } else {
        this.ProductForm.mxDataList.forEach((e) => {
          if (e.productNo === arr.productNo) {
            e.packageDataList = arr.packageDataList;
          }
        });
      }
      this.statistics();
      this.getExpends();
      this.isSemidialog = false;
    },
    // 详情
    getMaterielInfo(id) {},
    // 保存表头样式变化
    saveHead(newArray) {
      const parmas = newArray;
      setTimeout(() => {
        this.$api.common.saveTableStyle(parmas).then(() => {});
      }, 300);
    },
    // 保存表头列宽度
    surverWidth(newWidth, oldWidth, column) {
      setTimeout(() => {
        const heads = [...this.tableHead];
        heads.forEach((item) => {
          if (item.columnCode === column.property) {
            item.columnWidth = column.width;
            return;
          }
        });
        this.saveHead(heads);
      }, 100);
    },
    // 表格最大高度
    calHeight() {
      this.$nextTick(() => {
        const rect = this.$refs.tableCon.getBoundingClientRect();
        this.tableHeight = rect.height;
      });
    },
    // ，清除所有查询条件
    Refresh() {
      this.search = this.$options.data().search;
      this.getAllMaterils();
    },
    // 获取表格表头
    getTableHead() {
      const parmas = {
        tableCode: this.$config.cpscrapbilllist,
      };
      this.$api.common.getAllTableHead(parmas).then((res) => {
        res.sort(arraySort("columnSort"));
        this.tableHead = res;
      });
    },
    // 所有列表数据
    getAllMaterils() {
      const parmas = this.search;
      this.searchLoading = true;
      this.$api.warehouse
        .GetMatchPageFinishedProductScrapBills(parmas)
        .then((res) => {
          this.allMaterirls = res.list;
          this.allMaterirls.forEach((item) => {
            for (let i in item) {
              if (!item[i] && item[i] !== 0) {
                item[i] = "--";
              }
            }
          });
          this.total = res.totalCount;
          this.searchLoading = false;
        })
        .catch(() => {
          this.searchLoading = false;
        });
    },
    // 新建弹框关闭事件
    closeDialog() {
      if (this.$refs.ProductForm) {
        this.$refs.ProductForm.resetFields();
      }
      this.ProductForm = this.$options.data().ProductForm;
    },
  },
};
</script>
<style lang="scss" scoped>
.container {
  height: 100%;
}
.permangeRg {
  border: 1px solid #e6e6e6;
  background: #fff;
  height: 100%;

  .mainTT {
    font-size: 16px;
    font-weight: bold;
    width: 100%;
    padding: 18px 16px;
    padding-bottom: 0;
  }
}
.addWuliaoBox {
  // padding: 0px 16px 0 16px;
  .boxleft {
    padding: 5px 5px;
  }
  .boxright {
    height: 100%;
    padding: 5px 5px;
    border-left: 1px solid #eeeeee;
  }
  .tableBox {
    margin-top: 16px;
    border: 1px solid #e6e6e6;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    overflow: hidden;

    .tt {
      height: 38px;
      line-height: 38px;
      padding-left: 16px;
      background: #f7f8fa;
      border-radius: 8px 8px 0 0;
    }
  }
}

.subTip {
  border-bottom: 1px #e6e6e6 solid;
  background: #f5f6f9;
  padding: 8px 16px;
}

.dialogExpandTable {
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  margin: 0 10px;
}
</style>
